<template>
  <div id="wrapper">
    <div class="page-list" data-log="商品列表">
      <!--
      <div class="header">
          <div class="left">
              <a class="home"><img src="http://s1.mi.com/m/images/m/icon_back_n.png" class="ib"></a>
          </div>
          <div class="tit"><h2 data-log="HEAD-标题-商品列表"><span class="title">商品列表</span></h2></div>

          <div class="right">
              <a href="/1/#/search/index">
                  <div class="icon icon-search"></div>
              </a>
          </div>
      </div>
      -->
      <ol class="version">
        <li v-for="product in products">
          <router-link :to="{name:'Show',params:{id:product.id}}">
            <a class="version-item" href="">
              <div class="version-item-img"><img
                :src="product.thumb">
              </div>
              <div class="version-item-intro">
                <div class="version-item-name"><p>{{product.name}} {{product.description}}</p></div>
                <div class="version-item-intro-price"><span>{{product.price}}元</span></div>
              </div>
            </a>
          </router-link>
        </li>
      </ol>

      <my-footer></my-footer>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        products: []
      }
    },
    created() {
      this.init(); //初始化
    },

    methods: {
      init: function () {
        let category_id = this.$route.query.id;
        this.axios.get(`product/product_list?category_id=` + category_id)
          .then((response) => {
            console.log(response.data);
            this.products = response.data.products;
          })
      },


    }
  }
</script>




